import {defineStore} from 'pinia'
import {reactive, ref,markRaw,defineAsyncComponent} from 'vue'
//defineStore这个函数返回一个可以得到的仓库的函数
export default defineStore("dashboard", () => {
    const funcMap=markRaw({
        classroom:defineAsyncComponent(()=>import("@/views/Classroom/Classroom.vue")),
        staff:defineAsyncComponent(()=>import("@/views/Staff/Staff.vue")),
        func:defineAsyncComponent(()=>import("@/views/Func/Func.vue")),
        role:defineAsyncComponent(()=>import("@/views/Rolefunc/Rolefunc.vue")),
        user:defineAsyncComponent(()=>import("@/views/UserRole/UserRole.vue")),
        changepwd:defineAsyncComponent(()=>import("@/views/ChangePwd/ChangePwd.vue")),
        student:defineAsyncComponent(()=>import("@/views/Student/Student.vue")),
        class:defineAsyncComponent(()=>import("@/views/Class/Class.vue")),
      })


    const tabs = reactive<Array<string>>([]);
    const activeFunc = ref<string>("");

    const addTab = (menuItemIndex:string) => {
        if (tabs.indexOf(menuItemIndex) === -1) {
            tabs.push(menuItemIndex)
        }
        activeFunc.value = menuItemIndex;
    };
    const removeTab = (tabName:string) => {
        const i:number = tabs.indexOf(tabName);
        tabs.splice(i, 1);
        if (tabName !== activeFunc.value) {
        } else if (tabs.length === 0) activeFunc.value = "";
        else if (i > 0) activeFunc.value = tabs[i - 1];
        else activeFunc.value = tabs[0]
    }

    return {funcMap,tabs, activeFunc, addTab, removeTab}
})